<template>
    <div>
        <el-form label-position="left" label-width="100px" v-model="wordCloud">
          <el-form-item  label="形状">
               <el-select v-model="wordCloud.shape" placeholder="serif" size="mini">
                <el-option label="圆形" value="circle"/>
                <el-option label="心形" value="cardioid"/>
                <el-option label="菱形" value="diamond"/>
                <el-option label="三角形" value="triangle"/>
                <el-option label="三角形2" value="triangle-backward"/>
                <el-option label="五角星" value="pentagon"/>
                <el-option label="星星" value="star"/>
              </el-select>
          </el-form-item>
          <el-divider content-position="center">字号范围</el-divider>
          <el-form-item  label="最小值">
                <el-input-number v-model="wordCloud.sizeRange[0]" :min="0" size="mini"></el-input-number>
          </el-form-item>
          <el-form-item  label="最大值">
                <el-input-number v-model="wordCloud.sizeRange[1]" :min="0" size="mini"></el-input-number>
          </el-form-item>
          <el-divider content-position="center">旋转角度</el-divider>
          <el-form-item  label="最小值">
                <el-input-number v-model="wordCloud.rotationRange[0]" :min="-90" :max="90" size="mini"></el-input-number>
          </el-form-item>
          <el-form-item  label="最大值">
                <el-input-number v-model="wordCloud.rotationRange[1]" :min="-90" :max="90" size="mini"></el-input-number>
          </el-form-item>
          <el-divider content-position="center"></el-divider>
          <el-form-item  label="旋转步长">
                <el-input-number v-model="wordCloud.rotationStep" :min="0" :max="90" size="mini"></el-input-number>
          </el-form-item>
          <el-divider content-position="center"></el-divider>
          <el-form-item  label="间距">
                <el-input-number v-model="wordCloud.gridSize" :min="0" size="mini"></el-input-number>
          </el-form-item>
          <el-form-item  label="字体">
               <el-select v-model="wordCloud.fontFamily" placeholder="serif" size="mini">
                <el-option label="serif" value="serif"/>
                <el-option label="monospace" value="monospace"/>
                <el-option label="Courier New" value="Courier New"/>
                <el-option label="Microsoft YaHei" value="Microsoft YaHei"/>
              </el-select>
          </el-form-item>
          <el-form-item  label="粗细">
              <el-select v-model="wordCloud.fontWeight" placeholder="normal" size="mini">
                <el-option label="normal" value="normal"/>
                <el-option label="bold" value="bold"/>
                <el-option label="bolder" value="bolder"/>
                <el-option label="lighter" value="lighter"/>
              </el-select>
          </el-form-item>
        </el-form>
    </div>
</template>

<script>

export default {
  computed: {
    wordCloud () {
      return this.$store.state.layout[this.$store.state.activeArrayIndex].SlideContent[this.$store.state.insideActiveArrayIndex].itemContent.detail.wordCloud
    }
  },
  methods: {
  }
}
</script>

<style scoped>
    .el-form-item {
        margin-bottom: 0px
    }
</style>
